<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户列表</title>
</head>
<body>
    <h2>AJAX Demo</h2>
    <button type="button" onclick="loadJSON()">请求 JSON 数据</button>
    <div id="myDiv"></div>

    <script>
        function loadJSON() {
            let xhr;
            if (window.XMLHttpRequest) {
                xhr = new XMLHttpRequest();
            } else {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4 && xhr.status === 200) {
                    let myArr = JSON.parse(this.responseText);
                    justDoIt(myArr)
                }
            }
            xhr.open("GET", "/userList", true);
            xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
            xhr.send();
        }

        function justDoIt(arr) {
            let out = "<br>";
            let i;
            for (i = 0; i < arr.length; i++) {
                out += '<p>' + arr[i].name + "，" + arr[i].password + '</p>';
            }
            document.getElementById("myDiv").innerHTML = out;
        }
    </script>
</body>
</html>